<template>
  <div></div>
  <!-- <el-menu mode="horizontal"
    background-color="#282b33"
    text-color="#fff"
    active-text-color="#ffd04b"
    v-bind="$attrs"
    class="jimu-header-menuitem"
    >
    <template v-for="(item, index) in menus">
      <el-menu-item v-if="!item.children" index="1" :key="index">{{item.title}}</el-menu-item>
      <el-sub-menu index="2" v-else :key="index+'sub'">
        <template #title>{{item.title}}</template>
        <el-menu-item index="2-1">选项1</el-menu-item>
        <el-menu-item index="2-2">选项2</el-menu-item>
        <el-menu-item index="2-3">选项3</el-menu-item>
        <el-sub-menu index="2-4">
          <template #title>选项4</template>
          <el-menu-item index="2-4-1">选项1</el-menu-item>
          <el-menu-item index="2-4-2">选项2</el-menu-item>
          <el-menu-item index="2-4-3">选项3</el-menu-item>
        </el-sub-menu>
      </el-sub-menu>
    </template>
  </el-menu> -->
</template>

<script lang="ts">
import { defineComponent } from 'vue'

// interface menus {
//   title: string
// }

export default defineComponent({
  name: 'JimuHeaderMenuItem',
  props: {
    menus: {
      type: Array,
      default(){
        return [{title: '', children: []}]
      }
    }
  },
  // setup() {
    
  // },
})
</script>

<style lang="scss" scoped>
.jimu-header-menuitem{
  :deep(.el-sub-menu__title){
    height: 50px;
    line-height: 50px;
  }
}
</style>
